<template>
<div style="display:flex;">
  <div style="flex: 1.2;">
    <SellDisplay></SellDisplay>

    <a-affix :offset-bottom="50">
    <div style="display: flex;padding-top: 400px;">
<!--    <div style="padding-left: 50px"><a-button>挂起商品</a-button></div>-->
    <div style="padding-left: 25px" ><a-button danger @click="Delete">删除选中</a-button></div>
    <div style="padding-left: 400px;">

      <a-button type="primary" shape="round" size="large" @click="checkout">
      结账
    </a-button>
    </div>
    </div>
    </a-affix>
</div>

  <div style="flex: 1;border: 1px solid #ccc;height: 690px">
    <div style="height: 6%;border-bottom: 1px solid #ccc;display: flex">
      <div style="flex: 5;margin-top: 4px;padding-right: 150px">
        <a-input-search
            v-model:value="code"
            placeholder="输入编号查询"
            enter-button
            @search="selectGoodss"
        />
      </div>
      <div style="flex: 1;margin-top: 4px;padding-left: 130px">
        <el-button type="primary" :icon="FullScreen" round @click="scan"></el-button>

      </div>
      <div style="margin-top: 4px">
        <el-button type="primary" :icon="SwitchButton" circle @click="off"></el-button>
      </div>
    </div>

    <div style="height: 94%;width: 600px">
      <div >
        <router-view></router-view>
      </div>

    </div>
  </div>
</div>

</template>

<script>
import store from "@/store";
import { FullScreen,SwitchButton} from '@element-plus/icons-vue'
import Scan from "@/components/Scan";
import rounte from "@/components/rounte";
import {ref} from "vue";
import request from "@/utils/request";


export default {
  name: "Sell",
  components: {
    Scan,
    rounte
  },

  mounted() {


  },
  data(){
    return{
      // money:ref(0),
      code:ref(''),
    }
  },

  methods:{

    // getMoney(){
    //   let money
    //
    //   for (let i in store.getters.getSell){
    //     money+=store.getters.getSell[i].total
    //     console.log(store.getters.getSell[i].total)
    //   }
    //   this.money=money
    // },

    checkout(){
      request.post("http://localhost:8002/goods/sell",store.getters.getSell).then(res=>{
        let list=store.getters.getSell
        list.splice(0,list.length)
        store.commit('setCode',223)
        store.commit('setData','')
        this.$router.push('/sms/rounte')
      })
    },

    selectGoodss(){
      request.get("http://localhost:8002/goods/getGoodss/"+this.code).then(res=>{
        store.commit("setSellGoods",res.data)
        store.commit("setCode",250)
        this.$router.push("/sms/rounte")
      })
    },
    Delete(){
      let codeList=store.getters.getSellList
      let sellList=store.getters.getSell
      for (let i in codeList){
        sellList.forEach(function(item, index, arr) {    if(item.code === codeList[i]) {
          arr.splice(index, 1);
        }
        });
      }
      store.commit("setCode",111)
      this.$router.push("/sms/rounte")
      console.log(sellList)
      console.log(store.getters.getSell)
    },

    scan(){
      store.commit("setCode",222)
      this.$router.push("/sms/sell/scan")
    },
    off(){
      store.commit("setCode",'')
      this.$router.push("/sms/sell")
    }
  }
}
</script>
<script setup>
import { FullScreen } from '@element-plus/icons-vue'
import SellDisplay from "@/components/sell/SellDisplay";
</script>
<style scoped>

</style>